<template>
  <div class="my-foot pb-5 d-none d-lg-block">
    <div class="d-flex justify-content-center container">
      <div class="my-f1 text-light">
        <h3 class="mt-4 text-left">最热作品</h3>
        <p class="my-2">最热作品</p>
        <p class="my-2">点击率最高，深受大家喜爱的作品展示</p>
        <div class="d-flex flex-wrap justify-content-left">
          <div style="width:76px;height:76px;"><img src="../../assets/images/banner1.jpg" alt="" class="img-fluid img-thumbnail h-100 w-100 my-2 mx-2"></div>
        </div>
      </div>
      <div class="my-f2 text-light pr-5">
        <h3 class="mt-4 mb-4 text-left">联系我们</h3>
        <form class="d-flex flex-column border-0 pr-5">
            <input placeholder="邮箱" class="bg-dark mb-4 border-0 text-light" style="background:#1c1c1e;"/>
            <textarea placeholder="反馈信息" class="bg-dark mb-4 border-0 text-light" rows="3" style="background:#1c1c1e;"/>
            <br/>
            <button type="button" class="btn btn-secondary" style="background:#1c1c1e;">发送邮件</button>
        </form>
      </div>
      <div class="my-f3 text-light">
        <h3 class="mt-4 mb-4 text-left">最近展示</h3>
        <ul class="list-unstyled">
          <li class="media my-2" style="height: 80px;">
            <span class="mr-3" style="width:96px;height:72px;"><img class="img-fluid img-thumbnail  h-100 w-100" src="../../assets/images/banner1.jpg" alt=""></span>
            <div class="media-body pl-3" style="width:96px;height:80px;border-bottom: 1px dotted whitesmoke;">
              <h5 class="mt-0 mb-1"></h5>
            </div>
          </li>
        </ul>
      </div>
    </div>
  </div>
</template>
<script>
export default {
  name: 'myFoot',
  components: {
  }
}
</script>
<style scoped>
.my-foot {
  background: #1d1d20;
  clear: both;
}
.my-f1 {
  width: 33.333333%;
  height: inherit;
}
.my-f2 {
  width: 33.333333%;
  height: inherit;
}
.my-f3 {
  width: 33.333333%;
  height: inherit;
}
</style>
